<template>
	<div class="zy-content pb50">
		<back-level :go-page="backPage" />
		<Card title="报修信息" class="detail-content-layout">
			<div class="basic-info">
				<div class="basic-info-body">
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">班组</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.team }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">班次</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ workInfo.shift }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">报修人</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.repairApplicant }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">报修人电话</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.repairHotline }}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">验收状态</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.acceptanceStatus == '0' ? '新模' : '常规模' }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">工装所在设备编号</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ workInfo.punchNumber }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">压机编号</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.pressNumber }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">焊机编号</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.weldingMachineNumber || '--' }}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<!-- <Col span="6">
            <Row>
              <Col class="basic-info-body-label" span="24">冲速</Col>
              <Col class="basic-info-body-item" span="24">{{ workInfo.workOrderNo || '--' }}</Col>
            </Row>
            </Col> -->
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">冲压材料</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ workInfo.stampingMaterials }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">冲压用油</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.stamping }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">异常现象</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.abnormalPhenomena }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">紧急程度</Col>
								<Col class="basic-info-body-item" span="24">{{
									workInfo.urgencyLevel == 1 ? '特急' : workInfo.urgencyLevel == 2 ? '紧急' : '一般'
								}}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">是否附样</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ workInfo.sampleAttached == 1 ? '是' : '否' }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">附件信息</Col>
								<Col class="basic-info-body-item" span="24">
									<div class="fileWrap">
										<span class="file-list" v-for="(item, index) in fileList" :key="index">
											<span class="item-src" @click="handlePreview(item)">{{ item.fileName }}</span>
											<!-- <Icon class="item-icon" type="ios-trash-outline" size="20" @click="delFileList($event, index, true)">
                  </Icon> -->
										</span>
									</div>
								</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">生产确认人</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.productApplicant }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">品质确认人</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.mqualityApplicant }}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">工装确认人</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ workInfo.maintainApplicant }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">拆模类型</Col>
								<Col class="basic-info-body-item" span="24"
									>{{ workInfo.demoldingType ? demoList.find((item) => item.value == workInfo.demoldingType).label : ' ' }}
								</Col>
							</Row>
						</Col>
					</Row>
				</div>
			</div>
		</Card>
		<Card title="工装（产品）异常描述" class="detail-content-layout mt16">
			<div class="basic-info">
				<div class="basic-info-body">
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="12">
							<Row>
								<Col class="basic-info-body-label" span="24">模修部门</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.moldDeptName || '--' }}</Col>
							</Row>
						</Col>
						<Col span="12">
							<Row>
								<Col class="basic-info-body-label" span="24">工装异常描述</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.moldExceptionDesc || '--' }}</Col>
							</Row>
						</Col>
						<Col span="12">
							<Row>
								<Col class="basic-info-body-label" span="24">品质部门</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.qualityDeptName || '--' }}</Col>
							</Row>
						</Col>
						<Col span="12">
							<Row>
								<Col class="basic-info-body-label" span="24">品质异常描述</Col>
								<Col class="basic-info-body-item" span="24">{{ workInfo.mQualityExceptionDesc || '--' }}</Col>
							</Row>
						</Col>
					</Row>
				</div>
			</div>
		</Card>
		<Card title="工装信息" class="detail-content-layout mt16">
			<div class="basic-info">
				<div class="basic-info-body">
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24">工装编号</Col>
								<Col class="basic-info-body-item" span="24">{{ mold.moldCode }}</Col>
							</Row>
						</Col>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24">工装名称</Col>
								<Col class="basic-info-body-item" span="24">{{ mold.moldName }}</Col>
							</Row>
						</Col>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24">具体位置</Col>
								<Col class="basic-info-body-item" span="24">{{ mold.functionLocation }}</Col>
							</Row>
						</Col>
					</Row>
				</div>
			</div>
		</Card>
		<Card title="工单时间" class="detail-content-layout mt16">
			<div class="basic-info">
				<div class="basic-info-body">
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">故障发生时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.faultTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">拆模时间</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ time.beginTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">工装送达时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.productReveiveTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">工装收货时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.receiveTime }}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">开始维修时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.repairBeginTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">结束维修时间</Col>
								<Col class="basic-info-body-item editWrap" span="24">{{ time.repairCompleteTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">维修总时长</Col>
								<Col class="basic-info-body-item" span="24">{{ time.repairTime }}</Col>
							</Row>
						</Col>
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">（代装）生产停止时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.stopTime }}</Col>
							</Row>
						</Col>
					</Row>
					<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
						<Col span="6">
							<Row>
								<Col class="basic-info-body-label" span="24">最终审核时间</Col>
								<Col class="basic-info-body-item" span="24">{{ time.acceptTime }}</Col>
							</Row>
						</Col>
					</Row>
				</div>
			</div>
		</Card>
		<Card title="维修信息" class="detail-content-layout mt16" v-if="maintenanceStatus - 0 >= 6">
			<div class="basic-info">
				<div class="basic-info-body">
					<Form ref="repairForm" :model="form" label-position="top" :rules="validateRepair">
						<!-- {{ form }} -->
						<Row style="border-top: 1px solid #eee; border-bottom: 1px solid #eee">
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24">故障部位</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="faultPart">
											<Input v-model="form.faultPart" :border="false" :disabled="!showForm" :placeholder="`${$t('common.inputInfo')}`" />
										</FormItem>
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>故障现象</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="faultDesc">
											<Input v-model="form.faultDesc" :border="false" :disabled="!showForm" :placeholder="`${$t('common.inputInfo')}`" />
										</FormItem>
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>故障类型</Col>
									<Col class="basic-info-body-item" span="24" v-if="showForm">
										<FormItem label="" prop="faultTypeList">
											<Select multiple v-model="form.faultTypeList" filterable clearable :disabled="!showForm">
												<Option v-for="(item, index) in faultTypeList" :value="item.value" :key="index" :label="item.value" />
											</Select>
										</FormItem>
									</Col>
									<Col class="basic-info-body-item" span="24" v-else>
										{{ workInfo.faultTypeList }}
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<!-- <span style="color: red">*</span> -->
									<Col class="basic-info-body-label" span="24">部件</Col>
									<Col class="basic-info-body-item" span="24" v-if="showForm">
										<FormItem label="" prop="component">
											<Select multiple v-model="form.component" filterable clearable :disabled="!showForm">
												<Option v-for="(item, index) in bwList" :value="item.value" :key="index" :label="item.value" />
											</Select>
										</FormItem>
									</Col>
									<Col class="basic-info-body-item" span="24" v-else>
										{{ workInfo.component }}
									</Col>
								</Row>
							</Col>
						</Row>
						<Row style="border-bottom: 1px solid #eee">
							<Col span="12">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>故障原因</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="faultReason">
											<Input v-model="form.faultReason" :border="false" :disabled="!showForm" :placeholder="`${$t('common.inputInfo')}`" />
										</FormItem>
									</Col>
								</Row>
							</Col>
							<Col span="12">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>维修处置内容</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="repairContent">
											<Input v-model="form.repairContent" :border="false" :disabled="!showForm" :placeholder="`${$t('common.inputInfo')}`" />
										</FormItem>
									</Col>
								</Row>
							</Col>
						</Row>
						<Row style="border-bottom: 1px solid #eee">
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24">遗留问题</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="leftProblem">
											<Input v-model="form.leftProblem" :border="false" :disabled="!showForm" :placeholder="`${$t('common.inputInfo')}`" />
										</FormItem>
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>维修处置结果</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="repairResult">
											<Select v-model="form.repairResult" filterable clearable :disabled="!showForm">
												<Option v-for="(item, index) in repairResultList" :value="item.value" :key="index" :label="item.value" />
											</Select>
										</FormItem>
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24">{{ $t('common.UploadAttachment') }}</Col>
									<!--上传附件-->
									<Col class="basic-info-body-item" span="24" style="display: flex">
										<Upload v-if="showForm" :show-upload-list="false" :before-upload="handleBeforeUpload2" type="drag" action="">
											<!-- 点击上传 -->
											<Button type="primary">{{ $t('common.Upload') }}</Button>
										</Upload>
										<div class="fileWrap">
											<span class="file-list" v-for="(item, index) in endFileList" :key="index">
												<span class="item-src" @click="handlePreview(item)">{{ item.fileName }}</span>
												<Icon class="item-icon" type="ios-trash-outline" size="20" @click="delFileList($event, index, true)"> </Icon>
											</span>
										</div>
									</Col>
								</Row>
							</Col>
							<Col span="6">
								<Row>
									<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>是否重大变改</Col>
									<Col class="basic-info-body-item" span="24">
										<FormItem label="" prop="isGreatChange" :disabled="showForm">
											<RadioGroup v-model="form.isGreatChange">
												<Radio label="是" :disabled="!showForm">
													<span>是</span>
												</Radio>
												<Radio label="否" :disabled="!showForm">
													<span>否</span>
												</Radio>
											</RadioGroup>
										</FormItem>
									</Col>
								</Row>
							</Col>
						</Row>
					</Form>
				</div>
			</div>
		</Card>

		<Card title="协助维修人" class="mt16 detail-content-layout">
			<div class="basic-info">
				<div class="basic-info-title mb16">
					<Button v-if="showForm" type="primary" style="line-height: 32px" ghost shape="circle" icon="md-add" @click="openPersonnelSelectionModal"
						>添加协助维修人
					</Button>
				</div>
				<div class="basic-info-body">
					<Table :columns="assisterColumns" :data="assisterList">
						<template slot-scope="{ row, index }" slot="action" v-if="showForm">
							<!-- <span class="icon" @click="editMaterial(row)">{{ $t('common.Edit')
                }}</span> -->
							<span class="icon" @click="deletePerson(row, index)">{{ $t('common.Delete') }}</span>
						</template>
					</Table>
				</div>
			</div>
		</Card>

		<Card title="物料信息" class="mt16 detail-content-layout">
			<div class="basic-info">
				<div class="basic-info-title mb16">
					<Button v-if="showForm" type="primary" style="line-height: 32px" ghost shape="circle" icon="md-add" @click="handleAddDevice"
						>添加物料
					</Button>
				</div>
				<div class="basic-info-body">
					<Table :columns="makeColumns" :data="makeDataSource">
						<template slot-scope="{ row, index }" slot="action" v-if="showForm">
							<!-- <span class="icon" @click="editMaterial(row)">{{ $t('common.Edit')
                }}</span> -->
							<span class="icon" @click="deleteMaterial(row, index)">{{ $t('common.Delete') }}</span>
						</template>
					</Table>
				</div>
			</div>
		</Card>

		<Card :title="`${$t('升级记录')}`" class="detail-content-layout mt16">
			<div class="tableContent">
				<Table :columns="upgradeRecordColumns" :data="upgradeList" />
			</div>
		</Card>
		<!-- <Card :title="`${$t('fault.Scoring')}`" class="detail-content-layout mt16" v-if="maintenanceStatus - 0 >= 7">
			<div class="basic-info">
				<div class="basic-info-body">
					<Row>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>服务态度评分 </Col>
								<Col class="basic-info-body-item" span="24">
									<Rate :disabled="!showRateBtn" v-model="detailObj.serviceAttitudeRating" />
								</Col>
							</Row>
						</Col>
					</Row>
					<Row>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>技术能力评分 </Col>
								<Col class="basic-info-body-item" span="24">
									<Rate :disabled="!showRateBtn" v-model="detailObj.technicalAbilityRating" />
								</Col>
							</Row>
						</Col>
					</Row>
					<Row>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>响应速度评分</Col>
								<Col class="basic-info-body-item" span="24">
									<Rate :disabled="!showRateBtn" v-model="detailObj.responseSpeedRating" />
								</Col>
							</Row>
						</Col>
					</Row>
					<Row>
						<Col span="8">
							<Row>
								<Col class="basic-info-body-label" span="24"><span style="color: red">*</span>评语</Col>
								<Col class="basic-info-body-item" span="24">
									<Input v-model="detailObj.comment" :border="false" :disabled="!showRateBtn" :placeholder="`${$t('common.inputInfo')}`" />
								</Col>
							</Row>
						</Col>
					</Row>
				</div>
			</div>
		</Card> -->

		<add-material ref="addMaterial" @refresh="getDetailInfo" @addOk="addMaterialOk" />
		<!--        </Modal>-->
		<template>
			<gallery :images="galleryImages" :index="galleryIndex" @close="galleryIndex = null"></gallery>
		</template>
		<bottom-handle-wrap>
			<Button @click="backPage">{{ $t('common.Cancel') }}</Button>

			<template v-if="maintenanceStatus == '6' && readonly !== true">
				<Button type="primary" @click="maintainConfirmBtn">维修完成</Button>
			</template>
			<template v-if="maintenanceStatus == '7' && readonly !== true">
				<Button type="primary" @click="accept">验收</Button>
			</template>
		</bottom-handle-wrap>

		<personnel-selection-modal ref="personnelSelectionModal" :title="$t('请选择') + $t('人员')" :checkbox="true" @handleOk="selectPersonnel">
		</personnel-selection-modal>
		<commonModal ref="commonModal"></commonModal>
	</div>
</template>

<script>
import commonModal from "@/components/modalTypes/commonModal.vue";
import PersonnelSelectionModal from '@/components/PersonnelSelectionModal.vue';
import VueGallery from 'vue-gallery';
import addMaterial from './addMaterial.vue';

export default {
	name: 'moldRepairDetail',
	components: {
		addMaterial,
		gallery: VueGallery,
		PersonnelSelectionModal,
		commonModal
	},
	data() {
		return {
			fileList: [],
			id: null,
			maintenanceStatus: '',
			workInfo: {},
			mold: {},
			time: {},
			form: {},
			showForm: false,
			readonly: false,
			validateRepair: {
				// faultPart: [{ required: true, message: ' ', trigger: 'blur' }],
				isGreatChange: [{ required: true, message: ' ', trigger: 'change' }],
				repairResult: [{ required: true, message: ' ', trigger: 'change' }],
				faultReason: [{ required: true, message: ' ', trigger: 'blur' }],
				repairContent: [{ required: true, message: ' ', trigger: 'blur' }],
				// component: [{ required: true, message: ' ', trigger: 'change', type: 'array' }],
				faultTypeList: [{ required: true, message: ' ', trigger: 'change', type: 'array' }],
				faultDesc: [{ required: true, message: ' ', trigger: 'blur' }],
			},
			demoList: [
				{ label: '试模NG', value: '1' },
				{ label: '异常发生', value: '2' },
				{ label: '冲次满保养', value: '3' },
				{ label: '生产需要且完成任务', value: '4' },
			],
			repairResultList: [
				{ value: '未处理', label: '未处理' },
				{ value: '应急处理', label: '应急处理' },
				{ value: '复原处理', label: '复原处理' },
			],
			assisterList: [],
			bwList: [],
			faultLevelList: ['A', 'B', 'C'],
			updateTime10: false,
			updateTime9: false,
			editRecordList: [],
			analysisOfCausesEdit: false,
			upgradeRecordColumns: [
				{
					title: `${this.$t('升级等级')}`,
					key: 'upgradeLevel',
					align: 'center',
					minWidth: 120,
				},
				{
					title: `${this.$t('状态')}`,
					key: 'maintenanceStatus',
					align: 'center',
					minWidth: 120,
					render: (h, params) => {
						return h('div', [
							h('span', params.row.maintenanceStatus === '5' ? '待分配' : params.row.maintenanceStatus === '6' ? '维修中' : '升级中'),
						]);
					},
				},
				{
					title: `${this.$t('升级内容')}`,
					key: 'upgradeDescription',
					align: 'center',
					minWidth: 120,
				},
				{
					title: `${this.$t('升级时间')}`,
					key: 'upgradeTime',
					align: 'center',
					minWidth: 120,
				},
				{
					title: `${this.$t('升级人员')}`,
					key: 'repairedByName',
					align: 'center',
					minWidth: 320,
					tooltip: true,
					render: (h, params) => {
						return h('div', [h('span', params.row.repairedByName.join(','))]);
					},
				},
			],

			assisterColumns: [
				{
					title: '姓名',
					key: 'name',
					align: 'center',
					minWidth: 120,
				},
				{
					title: `${this.$t('common.operation')}`,
					slot: 'action',
					align: 'center',
					minWidth: 200,
				},
			],
			faultPosition: [],
			galleryIndex: null,
			galleryImages: [],
			optionsdate: {
				disabledDate(date) {
					return date && date.getTime() > Date.now();
				},
			},
			updateTime1: false,
			updateTime2: false,
			updateTime3: false,
			updateTime4: false,
			updateTime5: false,
			updateTime6: false,
			updateTime7: false,
			faultTime: '',
			faultList: [],
			showConfirmBtn: false,
			showStartBtn: false,
			showEndBtn: false,
			showOutBtn: false,
			showcheckBtn: false,
			// 非委外参数
			params: {
				faultAnalyse: '',
			},
			setFileList: [],
			statusText: '',
			orderDetailVisible: false,
			detailObj: {},
			mainTypeList: [{ value: '发动机', label: '发动机' }],
			maintainTypeList: [
				{ value: 0, label: this.$t('自行维修') },
				{ value: 1, label: this.$t('保修期内维修') },
				{
					value: 2,
					label: this.$t('委外维修'),
				},
			],
			makeColumns: [
				{
					title: '物料号',
					key: 'code',
					align: 'center',
					minWidth: 120,
				},
				{
					title: '品名',
					key: 'goodsName',
					align: 'center',
					minWidth: 120,
				},
				{
					title: '规格',
					key: 'specification',
					align: 'center',
					minWidth: 120,
				},
				{
					title: '数量',
					key: 'qty',
					align: 'center',
					minWidth: 120,
				},
				{
					title: `${this.$t('common.operation')}`,
					slot: 'action',
					align: 'center',
					minWidth: 200,
				},
			],
			makeDataSource: [],
			upgradeList: [],
			faultTypeList: [],
			endFileList: [],
			targetYpe: '',
			specificationList: [],
			analysisOfCausesList: [],
			solutionList: [],
			showRateBtn: false,
			recordData: [],
			faultTypeNameList: [],
			isRepairReject: false,
			solutionEdit: false,
			faultAnalyseDisable: false,
			reanalyzeObj: {
				whyList: [{ analyse: '' }, { analyse: '' }, { analyse: '' }, { analyse: '' }, { analyse: '' }],
			},
			userType: '',
			rejectList: [],
		};
	},
	created() {
		this.show(this.$route.query.id, this.$route.query.status);
		this.getDetailInfo(this.id);
		this.getFaultType();
		this.getFaultTypeList();
		this.getDistributionRecord();
		this.getBwList();
	},
	methods: {
		// 弹窗展示
		show(id, type) {
			this.orderDetailVisible = true;
			// this.showStartBtn = false
			// this.showConfirmBtn = false //
			// this.showEndBtn = false
			// this.showOutBtn = false
			// this.showRateBtn = false
			this.id = id;
			this.maintenanceStatus = type;
			if (type == '6') {
				this.showForm = true;
			}

			if (type == '7') {
				this.showRateBtn = true;
			}
			if (this.$route.query.type == 'view') {
				this.readonly = true;
				this.showForm = false;
				this.showRateBtn = false;
			} else this.readonly = false;
		},
		updateFaultVerification(params) {
			this.axios({
				method: 'post',
				url: '/dms/workOrder/updateFaultVerification',
				data: { ...params, dmsMaintainId: this.$route.query.id },
			}).then((res) => {
				if (res.code === 200) {
					this.getDetailInfo();
					this.$Message.success({ content: res.msg, duration: 6, closable: true });
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},
		openPersonnelSelectionModal(item) {
			this.userType = item;
			this.$refs['personnelSelectionModal'].open();
		},
		selectPersonnel(users) {
			let res = users.map((item) => {
				return {
					name: item.realname,
					userId: item.id,
				};
			});
			res = res.concat(this.assisterList);
			const map = new Map();
			const newArr = res.filter((v) => !map.has(v.userId) && map.set(v.userId, 1));
			this.assisterList = newArr;
			// let assisters = []
			// let userIds = []
			// users.forEach(item => {
			//   assisters.push(item.empno + '-' + item.realname)
			//   userIds.push(item.id)
			// })
			// if (this.userType === 1) {
			//   this.reanalyzeObj.principalStr = assisters.join(';')
			//   this.reanalyzeObj.principal = userIds
			// } else if (this.userType === 2) {
			//   this.reanalyzeObj.participantStr = assisters.join(';')
			//   this.reanalyzeObj.participant = userIds
			// } else {
			//   this.params.assister = assisters.join(';')
			//   this.params.userIds = userIds
			// }
			this.$forceUpdate();
			this.$refs['personnelSelectionModal'].close();
		},
		ifNeedBuyBackupsChange(val) {
			this.params.ifNeedBuyBackups = val;
			this.$forceUpdate();
		},
		backPage() {
			sessionStorage.setItem('moldRepairStatus', this.$route.query.status);
			this.$router.go(-1);
		},
		getDistributionRecord() {
			this.axios({
				method: 'get',
				url: '/dms/workOrder/distributionRecord',
				params: {
					workOrderId: this.$route.query.id,
				},
			}).then((res) => {
				if (res.code === 200) {
					this.recordData = res.data;
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},

		previewClicjk(item, index) {
			// console.log('这是/*什么')
			// console.log(this.detailObj.*/attachmentDTOs1)
			this.galleryIndex = index;
			let arr = this.detailObj.attachmentDTOs1;
			this.galleryImages = arr.map((val) => {
				if (val.filePath.includes('video')) {
					val.filetype = 'video/mp4';
				}
				if (val.filePath.includes('jpg')) {
					val.filetype = 'image/jpeg';
				}
				let params = {
					type: val.filetype,
					href: this.util.filePathToUrl(val.filePath),
				};

				return params;
			});
		},
		//获取故障数据
		getDetailInfo(id) {
			this.axios({
				method: 'get',
				url: '/dms/moldMaintenanceHall/selectInfoById',
				params: { id },
			}).then((res) => {
				if (res.code === 200) {
					this.mold = res.data.mold || {};
					this.time = res.data.time || {};
					this.workInfo = res.data.workInfo || {};
					this.assisterList = res.data.assisterList || {};
					this.upgradeList = res.data.upgradeList || [];
					this.detailObj = {
						serviceAttitudeRating: this.workInfo.serviceAttitudeRating,
						technicalAbilityRating: this.workInfo.technicalAbilityRating,
						responseSpeedRating: this.workInfo.responseSpeedRating,
						comment: this.workInfo.comment,
					};
					this.fileList = this.workInfo.uploadAttachments;
					this.form = {
						...this.workInfo,
					};
					this.endFileList = this.workInfo.uploadRepairAttachment;
					this.makeDataSource = res.data.materialList;
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},
		//获取故障数据
		getFaultType() {
			this.axios({
				method: 'get',
				url: '/dms/faultCategory/basicDict',
				params: { name: '故障分类' },
			}).then((res) => {
				if (res.code === 200) {
					this.faultList = res.data;
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},
		faultTypeNameChange(val) {
			this.detailObj.faultTypeName = val.label;
			this.detailObj.faultTypeId = val.id;
		},
		//获取故障类型数据
		getFaultTypeList() {
			this.axios({
				method: 'get',
				url: '/dms/faultCategory/dictList',
				params: {
					name: '故障类型',
				},
			}).then((res) => {
				this.faultTypeList = res.data || [];
			});
		},
		getBwList() {
			this.axios({
				method: 'get',
				url: '/dms/faultCategory/dictList',
				params: {
					name: '部件',
				},
			}).then((res) => {
				if (res.code === 200) {
					this.bwList = res.data;
				}
			});
		},
		// 验收
		accept() {
			// if (!this.detailObj.serviceAttitudeRating) {
			// 	this.$Message.warning({ content: this.$t('服务态度评分不能为空'), duration: 6, closable: true });
			// 	return;
			// }
			// if (!this.detailObj.technicalAbilityRating) {
			// 	this.$Message.warning({ content: this.$t('技术能力评分不能为空'), duration: 6, closable: true });
			// 	return;
			// }
			// if (!this.detailObj.responseSpeedRating) {
			// 	this.$Message.warning({ content: this.$t('响应速度评分不能为空'), duration: 6, closable: true });
			// 	return;
			// }

			// if (!this.detailObj.comment) {
			// 	this.$Message.warning({ content: this.$t('请输入评语'), duration: 6, closable: true });
			// 	return;
			// }
			this.$refs.commonModal.showModal({
				title: '验收确认',
				type: 'sure',
				desc: '确认是否验收完成？',
				submit: () => {
					this.axios({
						method: 'post',
						url: '/dms/moldMaintenanceHall/accept',
						data: {
							id: this.id,
							// ...this.detailObj,
						},
					}).then((res) => {
						if (res.code === 200) {
							this.backPage();
						} else {
							this.$Message.warning({ content: res.msg, duration: 6, closable: true });
						}
					});
				},
			});
		},
		// 故障确认
		maintainConfirmBtn() {
			this.$refs.repairForm.validate((valid) => {
				if (valid) {
					let param = {
						...this.form,
					};
					param.faultTypeList = param.faultTypeList.join(',');
					param.component = param.component?param.component.join(','):'';
					this.axios({
						method: 'post',
						url: '/dms/moldMaintenanceHall/complete',
						data: {
							...param,
							id: this.id,
							materialList: this.makeDataSource,
							assisterList: this.assisterList,
							uploadRepairAttachment: this.endFileList,
						},
					}).then((res) => {
						if (res.code === 200) {
							this.backPage();
						} else {
							this.$Message.warning({ content: res.msg, duration: 6, closable: true });
						}
					});
					// this.$emit('addOk', this.formTop)
					// this.handleCancel();
				} else {
					this.$Message.warning({ content: '请将维修信息填写完整', duration: 6, closable: true });
					return;
				}
			});
		},
		//文件上传
		handleBeforeUpload(file) {
			let formData = new FormData();
			formData.append('dir', 'device');
			formData.append('file', file);
			let config = {
				headers: {
					'Content-Type': 'multipart/form-data',
				},
			};
			this.axios({
				method: 'post',
				url: '/fileServer/upload',
				data: formData,
				config,
			}).then((res) => {
				if (res.code == 200) {
					this.setFileList.push({
						fileName: res.data.fileName,
						filePath: res.data.filepath,
						fileUrl: res.data.fileUrl,
					});
				}
			});
			return false;
		},
		//文件删除
		delFileList(e, i, end = false) {
			e.stopPropagation();
			if (end) {
				this.endFileList.splice(i, 1);
				return;
			}
			this.setFileList.splice(i, 1);
		},
		handlePreview(item) {
			if (item.filePath) {
				window.open(this.util.filePathToUrl(item.filePath));
			}
		},
		// 开始维修
		startManitain() {
			this.axios({
				method: 'get',
				url: '/dms/workOrder/beginToRepair',
				params: { workOrderId: this.detailObj.id },
			}).then((res) => {
				if (res.code === 200) {
					this.showStartBtn = false;
					this.showEndBtn = true;
					this.getDetailInfo();
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},
		// 添加备件
		handleAddDevice() {
			this.$refs.addMaterial.show();
		},
		// 编辑备件
		editMaterial(row) {
			this.$refs.addMaterial.show(this.detailObj.id, row, this.detailObj.deviceMId, this.detailObj.orgId);
		},
		// 删除备件
		deleteMaterial(row, index) {
			this.makeDataSource.splice(index, 1);
		},
		deletePerson(row, index) {
			this.assisterList.splice(index, 1);
		},
		//文件上传
		handleBeforeUpload2(file) {
			let formData = new FormData();
			formData.append('dir', 'device');
			formData.append('file', file);
			let config = {
				headers: {
					'Content-Type': 'multipart/form-data',
				},
			};
			this.axios({
				method: 'post',
				url: '/fileServer/upload',
				data: formData,
				config,
			}).then((res) => {
				if (res.code == 200) {
					this.endFileList.push({
						fileName: res.data.fileName,
						filePath: res.data.filepath,
						fileUrl: res.data.fileUrl,
					});
				}
			});
			return false;
		},
		// 完工
		endManitain() {
			// if (!this.detailObj.faultTypeName) {
			//   this.$Message.warning({ content: this.$t('请选择故障类型'), duration: 2, closable: true })
			//   return
			// }
			const params = {
				workOrderNo: this.detailObj.workOrderNo,
				id: this.detailObj.id,
				deviceUniqueId: this.detailObj.deviceId,
				// faultTypeCode: this.detailObj.faultTypeCode,
				faultTypeName: this.detailObj.faultTypeName,
				faultTypeId: this.detailObj.faultTypeId,
				platform: 1,
				attachmentDTOs: this.endFileList.map((v) => ({
					attachmentType: 3,
					...v,
				})),
			};
			this.axios({
				method: 'post',
				url: '/dms/workOrder/completion',
				data: params,
			}).then((res) => {
				if (res.code === 200) {
					this.showEndBtn = false;
					//this.showcheckBtn = true
					this.getDetailInfo();
				} else {
					this.$Message.warning({ content: res.msg, duration: 6, closable: true });
				}
			});
		},
		//添加物料
		addMaterialOk(data) {
			this.makeDataSource.push(data);
		},
	},
};
</script>

<style scoped lang="scss">
.handle-btn-wrap {
	display: inline-block;
	float: right;
	vertical-align: top;

	.handle-btn-item {
		display: inline-block;
		vertical-align: top;
		margin-left: 20px;
		cursor: pointer;

		.icon {
			margin-right: 0;
			font-size: 15px;
		}
	}
}

.btnEle {
	text-align: center;
	margin-top: 20px;
}

.dateform {
	margin-top: 4px;
}

::v-deep .ivu-icon-md-add {
	font-size: 20px;
}

::v-deep .ivu-rate-star {
	&::before {
		font-size: 30px;
	}
}

.icon {
	cursor: pointer;

	&:first-child {
		margin-right: 20px;
	}
}

.basic-info {
	::v-deep .ivu-select-selection {
		border: none;
	}

	.basic-info-title {
		span {
			display: inline-block;
			width: 7px;
			height: 24px;
			background: #187bdb;
		}

		h2 {
			display: inline-block;
			font-size: 16px;
			padding-left: 16px;
			position: relative;

			&::before {
				content: '';
				position: absolute;
				left: 0;
				top: -2px;
				width: 7px;
				height: 24px;
				background: #187bdb;
			}
		}
	}

	.basic-info-body {
		//margin: 15px 10px;
		color: #333;
		font-size: 13px;
		font-family: 'Arial Normal', 'Arial', sans-serif;
		font-weight: 400;
		border-left: 1px solid #eee;

		.editWrap {
			position: relative;

			.editTime {
				position: absolute;
				cursor: pointer;
				right: 10px;
				top: 0;
				color: #187bdb;
				font-size: 14px;

				.icon {
					font-size: 30px;
					vertical-align: middle;
				}
			}
		}

		.basic-info-body-label {
			display: inline-block;
			height: 40px;
			line-height: 40px;
			background: #f5f6f7;
			text-align: left;
			padding: 0 10px;
			border-right: 1px solid #eee;

			/*border-top: 1px solid #B6B7B7;*/
			/*border-bottom: 1px solid #B6B7B7;*/
			.fspan {
				cursor: pointer;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}

		.basic-info-body-item {
			display: inline-block;
			height: 40px;
			line-height: 40px;
			text-align: left;
			padding: 0 10px;
			border-right: 1px solid #eee;
			// border-right: 1px solid #eee;

			.preview {
				position: absolute;
				right: 10px;
				top: 0;
				width: 40px;
				height: 40px;
				background: #eee;

				.preview-img {
					width: 40px;
					height: 40px;
					overflow: hidden;
				}
			}

			::v-deep .ivu-upload-drag {
				display: flex;
				height: 40px;

				button {
					margin-top: 4px;
				}
			}

			.fileWrap {
				flex: 1;
				display: flex;
				overflow-y: scroll;
				flex-direction: column;

				&::-webkit-scrollbar {
					width: 4px;
				}
			}

			.file-list {
				padding-left: 20px;
			}
		}
	}

	.file-style {
		width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		color: #187bdb;
		cursor: pointer;
	}
}

.over-wrapper {
	width: 300px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

::v-deep .ivu-upload-drag:hover {
	border: none;
}

::v-deep .ivu-upload-drag {
	border: none;
}
</style>
